import React, { Component } from 'react'
//路由传参
import {withRouter} from "react-router-dom"
import {Bottom} from "antd-mobile"
import './subsuccess.scss';
class Subsuccess extends Component {
    
    handleClick = (params) => {
        this.props.history.push("/searchCenter");
    }

    //优惠券如何使用
    yhqClick = () =>  {
        this.props.history.push("/couponGuide");
    }

    //跳转完善订单页面
    orderClick= ()=>{
        //OrderInformation
        this.props.history.push("/orderInformation");
    }

    //跳转客服系统页面
    kefuClick=()=>{
        this.props.history.push("/onlineService");
    }
    
    render() {
        return (
            <div className="app"
                style={{padding:20}}
             >
                {/* 头部图片 */}
                <div className="header_img"
                    style={{display:"flex",flexDirection:"row",
                        justifyContent:"center",marginTop:60
                    }}
                >
                    <img
                    style={{
                        width:50,height:50
                    }}
                        src="http://qvlj6gd8v.hn-bkt.clouddn.com/ok.jpg"
                    ></img>
                </div>

                {/* main中间部分 */}
                <div className="main" 
                    style={{display:"flex",flexDirection:"column",alignItems:"center",marginTop:"28px",marginBottom:"20px"}}
                >
                    <span
                    style={{color:"rgb(160, 163, 171)",fontWeight:"bold",fontSize:"18px",marginBottom:"10px"}}
                    >恭喜您注册成功</span>
                    <h3
                    style={{color:"rgb(226, 153, 161)",fontSize:"18px",lineHeight:"50px"}}
                    >50.00元优惠券已到账</h3>
                    <p
                    style={{color:"rgb(175, 178, 191)",fontSize:"14px",lineHeight:"42px",fontWeight:"bold"}}
                    >完善<span
                        style={{fontSize:"26px",color:"rgb(220, 201, 42)",fontWeight:"normal"}}
                    >订单</span>信息后在领取价值1800元的好礼一份 </p>
                </div>

                {/* 底部按钮完善订单*/}
                <div className="order_content"
                    onClick={this.orderClick}
                    style={{display:"flex",flexDirection:"row",justifyContent:"center"}}
                >
                    <div className="order_content_ins"
                        style={{width:"250px",height:"50px",background:"rgb(224, 103, 84)",borderRadius:"50px"}}
                    >
                        <h3
                            style={{textAlign:"center",lineHeight:"50px",color:"rgb(245, 185, 173)"}}
                        >立即完善订单信息</h3>
                    </div>
                </div>
                
                {/* 优惠券如何使用 */}
                <div className="yhq_tips"
                    onClick={this.yhqClick}
                    style={{display:"flex",flexDirection:"row",justifyContent:"center",marginTop:"28px",
                    color:"skyblue"
                }}
                >
                    <a
                    style={{textDecoration:"underline"}}
                    >优惠券如何使用</a>
                </div>

                <div
                    style={{display:"flex",flexDirection:"row",justifyContent:"center",marginTop:"28px",
                    color:"skyblue"
                    }}
                onClick={this.kefuClick}
                >
                    跳转到客服系统
                </div>
            </div>
        )
    }
}
export default withRouter(Subsuccess)
